import { h, ref, reactive } from 'vue'
import TableAction from '@/components/DataTable/tools/Action.vue'
import { useUserStore } from '@/store/modules/user'

const roleId = ref(null)

/* 注册table */
const tableRef = ref()
const searchParams = ref()

function getRoleHandle() {
  roleId.value = useUserStore().userInfo.id // 该角色的id
}

function handleSearch(params) {
  const beginTime = params?.createTime ? params.createTime[0] : null
  const endTime = params?.createTime ? params.createTime[1] : null
  searchParams.value = {
    ...params,
    beginTime,
    endTime
  }
  delete searchParams.value.createTime
  tableRef.value.reFetch({ searchParams })
}

/**
 * @description: 分配
 * @param {*} row 单行数据
 * @param {*} type 操作类型 create:创建，preview:预览，edit:编辑
 * @return {*}
 */
async function getRowData(row, type) {
  data.rowData = row
  data.modalShow = true
}

/**
 * @description: 删除
 * @param {Array} ids id集合
 * @return {*}
 */
function deleteData(ids) {

}

// 问题 详情/处理
function questionHandle(row, type) {
  // type: 1处理, 2详情
  // router.push({ path: '/order-manage/order-detail', query: { rowId: row.id, type }})
  data.rowData = row
  data.questionDraw = true
  data.questionType = type
  data.drawTitle = type === 1 ? '工单处理' : type === 2 ? '工单详情' : ''
}

const data = reactive({
  tableRef,
  searchParams,
  rowData: {},
  modalShow: false,
  showDraw: false,
  detail: {},
  drawTitle: '',
  questionDraw: false,
  questionType: 2,
  handleSearch,
  deleteData,
  getRoleHandle,
  columns: [
    {
      title: '序号',
      key: 'key',
      render: (_, index) => {
        return `${index + 1}`
      },
      align: 'center',
      width: 80
    },
    {
      title: '工单编号',
      key: 'code',
      align: 'center'
    },
    {
      title: '已处理问题/已确认问题',
      key: 'questionNum',
      align: 'center'
    },
    {
      title: '工单状态',
      key: 'statusName',
      align: 'center'
    },
    {
      title: '工单生成时间',
      key: 'createTime',
      align: 'center'
    },
    {
      title: '分配人员',
      key: 'assignUserNames',
      align: 'center'
    },
    {
      title: '创建部门',
      key: 'deptName',
      align: 'center'
    },
    {
      title: '操作',
      align: 'center',
      width: 150,
      fixed: 'right',
      render(row) {
        return h(TableAction, {
          actions: [
            {
              label: '分配',
              type: 'button',
              props: {
                type: 'primary',
                text: true,
                onClick: getRowData.bind(null, row),
                style: {
                  // display: roleType.value === 2 && row.deptId === roleDeptId.value && row.status === 5 ? '' : 'none'
                  display: row.status === 5 ? '' : 'none'
                }
              },
              auth: 'order:list:dispatch'
              // auth: 'order:list:preview'
            },
            {
              label: '详情',
              type: 'button',
              props: {
                type: 'primary',
                text: true,
                onClick: questionHandle.bind(null, row, 2)
              },
              auth: 'order:list:preview'
            },
            {
              label: '处理',
              type: 'button',
              props: {
                type: 'primary',
                text: true,
                onClick: questionHandle.bind(null, row, 1),
                style: {
                  // display: roleType.value !== 1 && row.status === 10 ? '' : 'none'
                  display: row.status === 10 && row.assignUser.split(',').includes(roleId.value) ? '' : 'none'
                }
              },
              auth: 'order:list:dispose'
            }
          ],
          align: 'center'
        })
      }
    }
  ]
})

export default data
